<!DOCTYPE html>
<html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>转发界面</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="Cache-Control" content="no-store, must-revalidate">
    <meta http-equiv="expires" content="Wed, 26 Feb 1997 08:21:57 GMT">
    <meta http-equiv="expires" content="-1">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
          name="viewport">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" href="/dist/img/icon.png" type="image/x-icon">
    <!--字体-->
    <!--<link rel="stylesheet" href="/dist/css/font-awesome.min.css">-->
    <!--图标-->
    <!--<link rel="stylesheet" href="/dist/css/ionicons.min.css">-->
    <!--OA主样式-->
    <link rel="stylesheet" href="/dist/css/oa-app.css">
    <style>

        body {
            margin: 0px;
            background: #EEEEEE;
            -webkit-text-size-adjust: 100%;
            -moz-text-size-adjust: 100%;
            -ms-text-size-adjust: 100%;
            text-size-adjust: 100%;
        }

        .fw_item {
            width: auto;
            height: 80px;
            margin-top: 10px;
            margin-left: 10px;
            margin-right: 10px;
            /*box-shadow: 2px 2px 3px #DDDDDD;*/
            background: white;
            display: -webkit-flex; /* Safari */
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            justify-content: space-around;
            align-items: center;
            align-content: center;
            border-radius: 3px;
        }

        .fw_item1 {
            margin-left: 20px;
            margin-right: 10px;
            width: 30%;
            height: 75%;
        }

        .fw_item1 img {
            width: 100%;
            height: 100%;
        }

        .fw_item2 {
            width: 45%;
            height: 75%;
            display: -webkit-flex; /* Safari */
            display: inline-flex;
            flex-direction: column;
            justify-content: space-around;

        }

        .fw_title {
            width: auto;
            font-size: 16px;
            text-size-adjust: none;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            color: black;
        }

        .fw_zf {
            text-size-adjust: none;
            overflow: hidden;
            font-size: 14px;
            text-overflow: ellipsis;
            white-space: nowrap;
            color: #696969;

        }

        .fw_zf_span_blue {
            margin-left: 5px;
            font-size: 14px;
            font-weight: bold;
            color: #2B85D9;
        }

        .fw_zf_span_gray {
            margin-left: 5px;
            font-size: 14px;
            font-weight: bold;
            color: #696969;
        }

        .fw_item3 {
            width: 15%;
        }

        .fw_item3 img {
            width: 40px;
            height: 40px;

        }

        .fw_requirement {
            width: auto;
            height: auto;
            background: white;
            margin: 10px 10px 10px 10px;
            display: -webkit-flex; /* Safari */
            display: flex;
            flex-direction: column;
            flex-wrap: nowrap;
            justify-content: flex-start;
            align-items: flex-start;
            align-content: center;
            font-size: 12px;
            color: #696969;
            /*box-shadow: 2px 2px 3px #DDDDDD;*/
            border-radius: 3px;
        }

        .fw_rq1 {
            padding: 15px 20px 10px 20px;
        }

        .fw_rq2 {
            padding: 2px 20px 2px 20px;
        }

        .fw_rq3 {
            padding: 20px;
        }

        .no-data {
            font-size: 18px;
            text-align: center;
            color: dimgrey;
            margin-top: 50%;
        }

    </style>
</head>
<body>

<!--转发界面 转发内容item 的布局start  -->
<div id="app" v-cloak>
    <div class="oa-tab-scroll" v-if="companyList.length>1">
        <div class="oa-slide ">
            <div v-for="(item,i) in companyList" :class="selectIndex==i? 'tabActive':'tabNo'"
                 @click="getWechatShareDate(currentDate,item.id,i)">
                {{item.name}}
            </div>
        </div>
    </div>
    <div v-if="list.length!=0" :style="companyList.length>1?'margin-top: 55px;':''">

        <div class="fw_item" v-for="(item,index) in list">

            <div class="fw_item1" @click="goDetail(item)">
                <img v-bind:src="item.imageUrl">
            </div>
            <div class="fw_item2" @click="goDetail(item)">
                <div class="fw_title">{{item.name}}</div>
                <div class="fw_zf">统计转发:
                    <span v-if="!item.nightFlag" class="fw_zf_span_gray">未转发</span>
                    <span v-else class="fw_zf_span_blue">已转发</span>
                </div>
            </div>

            <div class="fw_item3" @click="goForward(item)">
                <img src="/dist/img/forward.png"/>
            </div>
        </div>

    </div>

    <div v-else-if="returnFlag" class="no-data">今日暂无转发内容</div>
    <!--转发界面 转发内容item 的布局end-->

    <!--转发界面 转发要求 的布局start  -->
    <div v-if="list.length!=0" class="fw_requirement">

        <div class="fw_rq1">{{currentDate}}易企秀转发要求:</div>

        <div class="fw_rq2">1.转发内容：列表中的易企秀</div>

        <div class="fw_rq2">2.转发时间： 19:00~21:00</div>

        <div class="fw_rq2">3.转发范围：微信朋友圈</div>

        <div class="fw_rq3">说明： 只统计转发时间范围内在微信朋友圈分享成功的易企秀</div>
    </div>
    <!--转发界面 转发要求 的布局end  -->
</div>
<script src="https://file.ggxqce.com/web/axios.min.js"></script>
<!--框架已定义 JS-->
<script src="/dist/js/newOaApp.js"></script>
<script src="https://file.ggxqce.com/web/vue.min.js"></script>
<script type="text/javascript">
    //错误预警*（app提示）
    window.onerror = function (msg, url, line, col, error) {
        JSBridge.call(UI, 'showToast', {title: "js错误:" + error})
    }
    Vue.config.errorHandler = function (error, vm, msg) {
        JSBridge.call(UI, 'showToast', {title: "js错误:" + error})
    }
    var app = new Vue({
        el: '#app',
        data: {
            returnFlag: false,
            userId: getUrlParamObj().userId,
            companyId: getUrlParamObj().companyId,
            list: [],
            selectIndex: 0,
            companyList: [],
            isIn12am: new Date().Format("h") < 12,
            isYesterdayAllForward: false,
            yesterdayDate: "", //昨天日期
            todayDate: new Date().Format('yyyy-MM-dd'),  //今天日期
            currentDate: ""
        },
        methods: {
            goForward: function (item) {
                var that = this

                var param = {
                    title: that.convertChar(item.name),
                    content: '',
                    imgUrl: item.imageUrl,
                    linkUrl: item.linkUrl.replaceAll('#', '') //解决某些微信链接带#号无法分享问题
                }
                JSBridge.call(SHARE, 'showShareMenu', param, function (res) {
                    if (res.sendData.data == "朋友圈分享成功") {
                        that.saveShareDate(getUrlParamObj().userId, item.id)
                    }
                })
            },
            convertChar: function (str) {
                //URL特殊符号及对应的十六进制值编码：
                // 1. +  URL 中+号表示空格 %2B
                // 2. 空格 URL中的空格可以用+号或者编码 %20
                // 3. /  分隔目录和子目录 %2F
                // 4. ?  分隔实际的 URL 和参数 %3F
                // 5. % 指定特殊字符 %25
                // 6. # 表示书签 %23
                // 7. & URL 中指定的参数间的分隔符 %26
                // 8. = URL 中指定参数的值 %3D
                return str.replace('/', '%2F')
                    .replace('%', '%25')
                    .replace('#', '%23')
                    .replace('&', '%26')
            },
            goDetail: function (item) {
                var param = {
                    screenType: '0',
                    title: item.name,
                    url: item.linkUrl,
                    showTitleBar: true,
                    enableRefresh: false,
                }
                JSBridge.call(ROUTER, 'navigateTo', param)
            },

            /**
             * 保存成功分享
             */
            saveShareDate: function (userId, shareId) {
                var that = this
                JSBridge.call(UI, 'showLoading', {})
                axios.post("/wechatShare/saveShareDetail.json", {
                    userId: userId,
                    wechatShareId: shareId,
                })
                    .then(function (r) {
                        //刷新页面
                        that.getWechatShareDate(that.currentDate, that.companyId);
                    })
            },
            /**
             * 查询转发列表
             * @param companyId
             * @param i
             */
            getWechatShareDate: function (searchDate, companyId, i) {
                var that = this;
                that.currentDate = searchDate
                that.companyId = companyId;
                that.index = i;
                if (i) {
                    that.selectIndex = i;
                } else {
                    that.selectIndex = 0;
                }
                JSBridge.call(UI, 'showLoading', {})
                axios.post(urlConfig.system.wechatShare.getWechatShare, {
                    userId: that.userId,
                    shareDate: that.currentDate,
                    companyId: that.companyId
                })
                    .then(function (r) {
                        //如果是昨日且全部转发, 在显示今日数据
                        if (that.currentDate == that.yesterdayDate) {
                            var allZf = true
                            if (r && r.length > 0) {
                                for (var i = 0; i < r.length; i++) {
                                    if (!r[i].nightFlag) {
                                        allZf = false;
                                    }
                                }
                            }
                            that.isYesterdayAllForward = allZf;
                            console.log(that.currentDate + "是否全部转发:" + that.isYesterdayAllForward)
                            //昨天未全部转发且在12am点前,仍显示昨日微信转发,否则显示今日转发
                            if (!that.isYesterdayAllForward && that.isIn12am) {
                                JSBridge.call(UI, 'hideLoading')
                                that.returnFlag = true
                                that.list = r;
                            } else {
                                that.getWechatShareDate(that.todayDate, companyId)
                            }
                        } else {
                            JSBridge.call(UI, 'hideLoading')
                            that.returnFlag = true
                            that.list = r;
                        }
                    })
            }
        },
        mounted: function () {
            var that = this;

            //获取昨天日期
            var day = new Date();
            day.setDate(day.getDate() - 1);
            that.yesterdayDate = day.Format("yyyy-MM-dd");

            JSBridge.call(UI, 'showLoading', {})
            //有权限查看所有公司的转发
            if (that.userId == '2019032510374ADAB0C094F387AF5939' //郭靖
                || that.userId == '2017121917304DF1A2D94B69CEF16770'//康健
                || that.userId == '20171219172947A5B519E1C58D66BE20'//薄哥
            ) {
                that.userId = '201711271733404C9DA1461F2421F828'
            }

            axios.post('/company/getCompanyListByUserId.json', {
                userId: that.userId
            })
                .then(function (r) {
//                JSBridge.call(UI, 'hideLoading')
                    console.log(r)
                    if (r && r.length > 0 && r.length <= 1) {
                        //仅有一个公司的
                        that.getWechatShareDate(that.yesterdayDate, r[0].id, 0);
                    } else if (r && r.length > 1) {
                        //管理多个公司
                        that.getWechatShareDate(that.todayDate, r[0].id, 0);
                    } else {
                        JSBridge.call(UI, 'showToast', {title: "请先配置公司"})
                    }
                    that.companyList = r;
                })
        }
    });
</script>

</body>
</html>